import Text from 'ol/style/Text'
import Fill from 'ol/style/fill'
import Stroke from 'ol/style/stroke'
import Style from 'ol/style/style'
import Icon from 'ol/style/Icon'
import olproj from 'ol/proj'
/**
 * 描点样式函数
 * @param icon 图标
 * @param name 文字
 * @param feature 描点对象
 * @param resolution 层级
 * */
export const pointFeatureStyle = function (icon, name, feature, resolution, level = 80) {
  return new Style({
    // 图标样式
    image: new Icon({
      anchorXUnits: 'pixels',
      anchorYUnits: 'pixels',
      anchor: [17, 17],
      // 应该使用的图标
      src: icon
    }),
    // 文字样式
    text: new Text({
      offsetY: -30,
      font: '15px 微软雅黑',
      fill: new Fill({ color: '#0057b1' }),
      stroke: new Stroke({ color: '#ffffff', width: 2 }),
      text: resolution < level ? name : ''
    }),
    // 填充样式
    fill: new Fill({
      color: [0, 0, 255, 0.2]
    })
  })
}
/**
 * 多边形样式函数
 * @param icon 图标
 * @param name 文字
 * @param feature 描点对象
 * @param resolution 层级
 * */
export const polygonFeatureStyle = function (name, fillColor, strokeColor, feature, resolution) {
  return new Style({
    fill: new Fill({
      color: fillColor
    }),
    stroke: new Stroke({
      color: strokeColor,
      width: 3
    }),
    text: new Text({
      text: name,
      font: '16px Calibri,sans-serif',
      fill: new Fill({
        color: '#000'
      }),
      stroke: new Stroke({
        color: '#fff',
        width: 3
      })
    })
  })
}

export const initCenter = {
  center: olproj.transform(
    [114.30878471, 30.591228],
    'EPSG:4326',
    // 正式
    'EPSG:3857'
  ),
  zoom: 11
}
